<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2017/11/21 0021
  Time: 11:37
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ include file="/WEB-INF/jsp/common/tagPage.jsp" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <link rel="stylesheet" type="text/css" href="${baseurl}bite/css/bootstrap-3.3.4.css">
    <script src="${baseurl}bite/js/jquery-1.10.2.js"></script>
    <script src="${baseurl}bite/js/bootstrap-3.3.4.js"></script>
    <title>文件管理</title>
    <link rel="stylesheet" type="text/css" href="${baseurl}bite/files/css/ue_grid.css"/>
    <link rel="stylesheet" type="text/css" href="${baseurl}bite/files/css/style.css"/>
    <link rel="stylesheet" type="text/css" href="${baseurl}bite/files/css/style2.css"/>
    <!-- Animate.css -->
    <link rel="stylesheet" href="${baseurl}bite/files/css/animate.css">
    <link rel="stylesheet" href="${baseurl}statics/assets/css/you.css">
    <!-- Magnific Popup -->
    <link rel="stylesheet" href="${baseurl}bite/files/css/magnific-popup.css">
    <!-- Salvattore -->
    <link rel="stylesheet" href="${baseurl}bite/files/css/salvattore.css">
    <!-- Theme Style -->
    <link rel="stylesheet" href="${baseurl}bite/files/css/style.css">
    <!-- Modernizr JS -->
    <script src="${baseurl}bite/files/js/modernizr-2.6.2.min.js"></script>
    <!-- FOR IE9 below -->
    <!--[if lt IE 9]>
    <script src="${baseurl}bite/files/js/respond.min.js"></script>
    <![endif]-->
    <script language="javascript" src="${baseurl}bite/files/js/jquery.easing.min.js"></script>
    <script language="javascript" src="${baseurl}bite/files/js/custom.js"></script>
    <style>
        select, input {
            border: 1px solid #aaa;
            padding: 3px 8px;
            border-radius: 5px;
            background: #fff;
        }

        select, input:hover {
            border: 1px solid #000;
        }

        select.selectpicker {
            height: 34px;
            border: 1px solid #aaa;
        }

        .item .animate-box a img {
            width: 100%;
        }

        a.fileDelete {
            position: absolute;
            z-index: 1;
            top: 5px;
            right: 5px;
            padding: 2px 10px;
            background: #ff914b;
            color: #fff;
            box-shadow: 1px 1px 4px #d29771;
            border-radius: 4px;
            font-size: 13px;
            line-height: 22px;
            letter-spacing: 2px;
            text-decoration: none;
            visibility: hidden;
            opacity: 0;
        }

        .item:hover a.fileDelete {
            opacity: 1;
            visibility: visible;
        }
    </style>
    <script>

        function openWindow(url) {
            $('.theme-popover-mask').fadeIn(100);
            $('.theme-popover').slideDown(200);
            var html = '<center><div>' +
                '<video controls="" autoplay="" name="media" class="video" width="280px" height="450px"><source src="' + url + '"></video>' +
                '</div></center>';
            $(".theme-popover-video").append(html);
        }
        $(document).keydown(function (event) {
            if (event.keyCode == 27) {
                var userName = $("#userName").val();
                $('.theme-popover-mask').fadeIn(100);
                $('.theme-popover').slideDown(200);
                window.location.href = '${baseurl}fileManagerController/index?userName=${user.userName}';
//                    window.history.back();
            }
        });

        function checkGroupName(){//alert("1");
                document.getElementById("gName").innerHTML="";
                var imageName = $("#imageName").val().trim();
                var reName = $("#reName").val().trim();
                if( reName.length <1 ||imageName.length <1 || reName.length >12)
                {
                    document.getElementById("gName").innerHTML='请选择上传文件并输入文件名称';
                }else{
                    document.getElementById("gName").innerHTML="";
                    var reName = $("#reName").val().trim();
                    var userName = $("#userName").val();

                    $.ajax({
                        url: "${baseurl}fileManagerController/selectByFileName",
                        type: "post",
                        dataType: 'json',
                        data: {"userId":${user.id},
                            "fileName":reName},
                        success: function (json) {
                            var jsonData= eval(json.info);
                            //alert(jsonData.toString());
                            //alert(jsonData.length);
                            if(jsonData.length>0){
                                document.getElementById("gName").innerHTML="该名称已存在";
                            }else {
                                document.getElementById("gName").innerHTML="";
                                $("#login_form9").submit();
                            }
                        },
                        error: function (json) {
                            alert("error");
                        }
                    });
                    //$("#login_form9").submit();

                }
        }

    </script>
</head>
<body>
<div class="clear">
</div>
<div class="loginmask">
</div>

<div id="reg_setp">
    <div class="back_setp">
        返回
    </div>
    <form id="login_form9" class="form-horizontal required-validate" action="${baseurl}fileManagerController/fileSave"
          enctype="multipart/form-data" method="post">
        <input type="hidden" value="${user.id}" name="userId" id="userId"/>
        <input type="hidden" value="${user.userName}" name="userName" id="userName"/>
        <div id="setp_quicklogin">
            <h2>上传文件</h2>
            <div class="fileUpload">
                <div class="fileUpLis">
                    <input type="file" id="imageName" name="filename" class="projectfile" value="${deal.image}"/>
                </div>
                <div class="fileUpLis">
                    <input type="text" id="reName" name="reName"   placeholder="输入文件名称"><span id="gName" style="color: #FF0000"><span/>
                </div>
                <div class="fileUpBtn">
                    <input type="button" onclick="checkGroupName()" value="确认上传"/>
                    <input type="reset" value="取消" onclick="javascript:history.go(-1)"/>

                </div>
            </div>
        </div>
    </form>
</div>




<div id="content">
    <div id="content-body">
        <div id="reportTableDiv" class="span10">
            <form action="${baseurl}fileManagerController/index">
                <div class="container" style="text-align: center;">
                    <input type="button" id="e2" value="添加文件" class="reg"/>
                    <br><br>
                    <input type="hidden" value="${user.userName}" name="userName" id="userName1"/>
                    <input type="text" id="e" name="keywords" placeholder="上传人/案件名称" value=""/>
                    <select class="selectpicker" name="fileType" id="fileType" title="文件类型" onchange="clickType()">
                        <option value="">文件类型</option>
                        <c:forEach items="${fileType}" var="file">
                            <option value="${file.dictFormat}">${file.dictName}</option>
                        </c:forEach>
                    </select>
                    <select class="selectpicker" name="fileStyle" id="fileStyle" title="文件类型">
                        <option value="">文件格式</option>
                    </select>
                    <input type="submit" id="e1" value="查询" class="" onclick="checkUser();"/>
                </div>
            </form>
            <div id="fh5co-main">
                <div class="container">
                    <div class="row" id="row">
                        <div id="fh5co-board" data-columns>
                            <c:forEach items="${files}" var="files">
                                <c:if test="${files.fileType == 1}">
                                    <div class="item">
                                        <div class="animate-box">
                                            <a href="javascript:void(0)" class="fileDelete"
                                               onclick="deleteBtn('${files.id}')">删除</a>
                                            <a href="${files.fileUrl}" class="image-popup fh5co-board-img"><img
                                                    src="${files.fileUrl}" width="100%"></a>
                                            <div class="fh5co-desc">${files.fileName}<br/><fmt:formatDate
                                                    value="${files.createTime}"
                                                    pattern="YYYY年M月d日 HH:mm:ss"></fmt:formatDate></div>
                                        </div>
                                    </div>
                                </c:if>
                                <c:if test="${files.fileType == 2}">
                                    <div class="item">
                                        <div class="animate-box"><img src="${baseurl}bite/images/music.png"
                                                                      style="height:185px;">
                                            <a href="javascript:void(0)" class="fileDelete"
                                               onclick="deleteBtn('${files.id}')">删除</a>
                                            <audio controls volume="0.9">
                                                <source src="${files.fileUrl}" type="audio/ogg">
                                                <source src="${files.fileUrl}" type="audio/mpeg">
                                            </audio>
                                            <div class="fh5co-desc">${files.fileName}<br/><fmt:formatDate
                                                    value="${files.createTime}"
                                                    pattern="YYYY年M月d日 HH:mm:ss"></fmt:formatDate></div>
                                        </div>
                                    </div>
                                </c:if>
                                <c:if test="${files.fileType == 3}">
                                    <div class="item">
                                        <div class="animate-box" ondblclick="openWindow('${files.fileUrl}');">
                                            <a href="javascript:void(0)" class="fileDelete"
                                               onclick="deleteBtn('${files.id}')">删除</a>
                                            <video class="video" autoplay="autoplay"
                                                   poster="${baseurl}bite/images/video.png"
                                                   style="width: 225px;height:217px;" preload="Auto"
                                                   controls="controls">
                                                <source src="${files.fileUrl}"/>
                                            </video>
                                            <div class="fh5co-desc">${files.fileName}<br/><fmt:formatDate
                                                    value="${files.createTime}"
                                                    pattern="YYYY年M月d日 HH:mm:ss"></fmt:formatDate></div>
                                        </div>
                                    </div>
                                </c:if>
                                <c:if test="${files.fileType == 4}">
                                    <c:if test="${fn:toLowerCase(files.fileStyle)=='.docx' || fn:toLowerCase(files.fileStyle)=='.doc'}">
                                        <div class="item">
                                            <div class="animate-box">
                                                <a href="javascript:void(0)" class="fileDelete"
                                                   onclick="deleteBtn('${files.id}')">删除</a>
                                                <a href="${files.fileUrl}"><img src="${baseurl}bite/images/word.png"
                                                                                style="width: 225px;height:225px;"
                                                                                width="100%"></a>
                                                <div class="fh5co-desc">${files.fileName}<br/><fmt:formatDate
                                                        value="${files.createTime}"
                                                        pattern="YYYY年M月d日 HH:mm:ss"></fmt:formatDate></div>
                                            </div>
                                        </div>
                                    </c:if>
                                    <c:if test="${fn:toLowerCase(files.fileStyle)=='.txt'}">
                                        <div class="item">
                                            <div class="animate-box">
                                                <a href="javascript:void(0)" class="fileDelete"
                                                   onclick="deleteBtn('${files.id}')">删除</a>
                                                <a href="${files.fileUrl}"><img src="${baseurl}bite/images/txt.png"
                                                                                style="width: 225px;height:225px;"
                                                                                width="100%"></a>
                                                <div class="fh5co-desc">${files.fileName}<br/><fmt:formatDate
                                                        value="${files.createTime}"
                                                        pattern="YYYY年M月d日 HH:mm:ss"></fmt:formatDate></div>
                                            </div>
                                        </div>
                                    </c:if>
                                    <c:if test="${fn:toLowerCase(files.fileStyle)=='.wps'}">
                                        <div class="item">
                                            <div class="animate-box">
                                                <a href="javascript:void(0)" class="fileDelete"
                                                   onclick="deleteBtn('${files.id}')">删除</a>
                                                <a href="${files.fileUrl}"><img src="${baseurl}bite/images/wps.png"
                                                                                style="width: 225px;height:225px;"
                                                                                width="100%"></a>
                                                <div class="fh5co-desc">${files.fileName}<br/><fmt:formatDate
                                                        value="${files.createTime}"
                                                        pattern="YYYY年M月d日 HH:mm:ss"></fmt:formatDate></div>
                                            </div>
                                        </div>
                                    </c:if>
                                    <c:if test="${fn:toLowerCase(files.fileStyle)=='.xls' || fn:toLowerCase(files.fileStyle)=='.xlsx'}">
                                        <div class="item">
                                            <div class="animate-box">
                                                <a href="javascript:void(0)" class="fileDelete"
                                                   onclick="deleteBtn('${files.id}')">删除</a>
                                                <a href="${files.fileUrl}"><img src="${baseurl}bite/images/excel.png"
                                                                                style="width: 225px;height:225px;"
                                                                                width="100%"></a>
                                                <div class="fh5co-desc">${files.fileName}<br/><fmt:formatDate
                                                        value="${files.createTime}"
                                                        pattern="YYYY年M月d日 HH:mm:ss"></fmt:formatDate></div>
                                            </div>
                                        </div>
                                    </c:if>
                                    <c:if test="${fn:toLowerCase(files.fileStyle)=='.pdf'}">
                                        <div class="item">
                                            <div class="animate-box">
                                                <a href="javascript:void(0)" class="fileDelete"
                                                   onclick="deleteBtn('${files.id}')">删除</a>
                                                <a href="${files.fileUrl}"><img src="${baseurl}bite/images/pdf.png"
                                                                                style="width: 225px;height:225px;"
                                                                                width="100%"></a>
                                                <div class="fh5co-desc">${files.fileName}<br/><fmt:formatDate
                                                        value="${files.createTime}"
                                                        pattern="YYYY年M月d日 HH:mm:ss"></fmt:formatDate></div>
                                            </div>
                                        </div>
                                    </c:if>
                                    <c:if test="${fn:toLowerCase(files.fileStyle)=='.ppt'}">
                                        <div class="item">
                                            <div class="animate-box">
                                                <a href="javascript:void(0)" class="fileDelete"
                                                   onclick="deleteBtn('${files.id}')">删除</a>
                                                <a href="${files.fileUrl}"><img src="${baseurl}bite/images/ppt.jpg"
                                                                                style="width: 225px;height:225px;"
                                                                                width="100%"></a>
                                                <div class="fh5co-desc">${files.fileName}<br/><fmt:formatDate
                                                        value="${files.createTime}"
                                                        pattern="YYYY年M月d日 HH:mm:ss"></fmt:formatDate></div>
                                            </div>
                                        </div>
                                    </c:if>
                                    <c:if test="${fn:toLowerCase(files.fileStyle)=='.rar'}">
                                        <div class="item">
                                            <div class="animate-box">
                                                <a href="javascript:void(0)" class="fileDelete"
                                                   onclick="deleteBtn('${files.id}')">删除</a>
                                                <a href="${files.fileUrl}"><img src="${baseurl}bite/images/rar.jpg"
                                                                                style="width: 225px;height:225px;"
                                                                                width="100%"></a>
                                                <div class="fh5co-desc">${files.fileName}<br/><fmt:formatDate
                                                        value="${files.createTime}"
                                                        pattern="YYYY年M月d日 HH:mm:ss"></fmt:formatDate></div>
                                            </div>
                                        </div>
                                    </c:if>
                                    <c:if test="${fn:toLowerCase(files.fileStyle)=='.zip'}">
                                        <div class="item">
                                            <div class="animate-box">
                                                <a href="javascript:void(0)" class="fileDelete"
                                                   onclick="deleteBtn('${files.id}')">删除</a>
                                                <a href="${files.fileUrl}"><img src="${baseurl}bite/images/zip.jpg"
                                                                                style="width: 225px;height:225px;"
                                                                                width="100%"></a>
                                                <div class="fh5co-desc">${files.fileName}<br/><fmt:formatDate
                                                        value="${files.createTime}"
                                                        pattern="YYYY年M月d日 HHH:mm:ss"></fmt:formatDate></div>
                                            </div>
                                        </div>
                                    </c:if>
                                    <c:if test="${fn:toLowerCase(files.fileStyle)=='.exe'}">
                                        <div class="item">
                                            <div class="animate-box">
                                                <a href="javascript:void(0)" class="fileDelete"
                                                   onclick="deleteBtn('${files.id}')">删除</a>
                                                <a href="${files.fileUrl}"><img src="${baseurl}bite/images/exe.jpg"
                                                                                style="width: 225px;height:225px;"
                                                                                width="100%"></a>
                                                <div class="fh5co-desc">${files.fileName}<br/><fmt:formatDate
                                                        value="${files.createTime}"
                                                        pattern="YYYY年M月d日 HHH:mm:ss"></fmt:formatDate></div>
                                            </div>
                                        </div>
                                    </c:if>
                                    <c:if test="${fn:toLowerCase(files.fileStyle)=='.xml'}">
                                        <div class="item">
                                            <div class="animate-box">
                                                <a href="javascript:void(0)" class="fileDelete"
                                                   onclick="deleteBtn('${files.id}')">删除</a>
                                                <a href="${files.fileUrl}"><img src="${baseurl}bite/images/xml.jpg"
                                                                                style="width: 225px;height:225px;"
                                                                                width="100%"></a>
                                                <div class="fh5co-desc">${files.fileName}<br/><fmt:formatDate
                                                        value="${files.createTime}"
                                                        pattern="YYYY年M月d日 HHH:mm:ss"></fmt:formatDate></div>
                                            </div>
                                        </div>
                                    </c:if>
                                </c:if>
                            </c:forEach>
                        </div>
                    </div>
                </div>
            </div>
            <!-- jQuery -->
            <script src="http://www.jq22.com/jquery/jquery-1.10.2.js"></script>
            <!-- jQuery Easing -->
            <script src="${baseurl}bite/files/js/jquery.easing.1.3.js"></script>
            <!-- Bootstrap -->
            <script src="http://www.jq22.com/jquery/bootstrap-3.3.4.js"></script>
            <!-- Waypoints -->
            <script src="${baseurl}bite/files/js/jquery.waypoints.min.js"></script>
            <!-- Magnific Popup -->
            <script src="${baseurl}bite/files/js/jquery.magnific-popup.min.js"></script>
            <!-- Salvattore -->
            <script src="${baseurl}bite/files/js/salvattore.min.js"></script>
            <!-- Main JS -->
            <script src="${baseurl}bite/files/js/main.js"></script>

            <script type="text/javascript">
                function clickType() {
                    $("#fileStyle").html("");
                    var dictFormat = $("#fileType").val();
                    $.ajax({
                        url: "${baseurl}fileManagerController/selectFileFormat",
                        data: {"dictFormat": dictFormat},
                        type: "post",
                        success: function (data) {
                            $("#fileStyle").append('<option value ="" selected="selected">文件格式</option>');
                            for (var i = 0; i < data.length; i++) {
                                var text = '<option value=' + data[i].dictName + '>' + data[i].dictName + '</option>';
                                $("#fileStyle").append(text);
                            }
                        }
                    });
                }

                function requestFullScreen() {
                    var de = document.documentElement;
                    if (de.requestFullscreen) {
                        de.requestFullscreen();
                    } else if (de.mozRequestFullScreen) {
                        de.mozRequestFullScreen();
                    } else if (de.webkitRequestFullScreen) {
                        de.webkitRequestFullScreen();
                    }
                }

                function deleteBtn(id) {
                    var k = window.confirm("确定是否要删除！");
                    if (k) {
                        var userName = $("#userName1").val();
                        $.ajax({
                            url: "${baseurl}fileManagerController/deleteFile",
                            data: {"id": id},
                            type: "post",
                            async: true,
                            success: function (data) {
                                if (data == 1) {
                                    //window.location.reload();
                                    location.href='${baseurl}fileManagerController/index?userName='+userName;
                                    alert("删除文件成功!");
                                } else {
                                    alert("删除文件失败!");
                                }
                            }
                        });
                    }
                }
            </script>
        </div>
    </div>
</div>
</body>
</html>